<extend name="Base/base" />
<block name="main">
        <!-- Content Header (Page header) -->
        <section class="content-header">
			<h1>
				链接信息表
				<small>preview of simple tables</small>
			</h1>
			<ol class="breadcrumb">
				<li><a href="__MODULE__/Index/index"><i class="fa fa-dashboard"></i> 首页</a></li>
				<li><a href="#">友情链接</a></li>
				<li class="active">列表</li>
			</ol>
        </section>

        <!-- Main content -->
        <section class="content">
          <div class="row">
            <div class="col-md-12">
              <div class="box">
                <div class="box-header with-border">
                  <h3 class="box-title"><i class="fa fa-th"></i> 友情链接</h3>
                </div><!-- /.box-header -->
                <div class="box-body">
					<table id="linklist" class="table table-bordered table-hover">
					<thead>
						<tr>
						  <th>ID</th>
						  <th>链接名</th>
						  <th>链接地址</th>
						  <th>添加时间</th>
						  <th>操作</th>
						</tr>
					</thead>
					<tbody>
				<foreach name="list" item="link">
						<tr class="{$link.id}">
						  <td>{$link.id}</td>
						  <td>{$link.name}</td>
						  <td>{$link.url}</td>
						  <td>{$link.addtime|date="Y-m-d",###}</td>
						  <td>
							<button class="btn btn-xs btn-primary" onclick="edit({$link.id})" data-toggle="modal" data-target="#update">编辑</button>
							<button class="btn btn-xs btn-danger" onclick="doDel({$link.id},this)">删除</button>
						  </td>
						</tr>
                </foreach>
				</tbody>
                  </table>
				
                </div><!-- /.box-body -->
				
                <div class="box-footer clearfix">
                  <ul class="pagination pagination-sm no-margin pull-right">
                     {$pageinfo}
                  </ul>
				  <button class="btn btn-primary" data-toggle="modal" data-target="#Add">添加链接信息</button>
                </div>
				 
              </div><!-- /.box -->

            </div><!-- /.col -->
            
          </div><!-- /.row -->
         
        </section><!-- /.content -->
 </block>
 <block name="myscript">
	<!--添加-->
	<div class="modal fade" id="Add" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel">
        <div class="modal-dialog" role="document">
        <div class="modal-content">
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
            <h4 class="modal-title" id="exampleModalLabel">添加友情链接</h4>
          </div>
		  <form id="addLink" method="post">
          <div class="modal-body">
			
              <div class="form-group">
                <label for="recipient-name" class="control-label">链接名：</label>
                <input type="text" class="form-control" name="name" id="linkname"><span id="warn1"></span>
              </div>
              <div class="form-group">
                <label for="recipient-name" class="control-label">链接地址：</label>
                <input type="text" class="form-control" name="url" id="linkaddr"><span id="warn2"></span>
              </div>
          </div>
		   </form>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
            <button type="submit" id="send" onclick="doAdd()" class="btn btn-primary">添加</button>
          </div>
		  
        </div>
      </div>
    </div>
	
	<!--编辑-->
    <div class="modal fade" id="update" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel">
        <div class="modal-dialog" role="document">
        <div class="modal-content">
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
            <h4 class="modal-title" id="exampleModalLabel">修改友情链接</h4>
          </div>
          <div class="modal-body">
            <form id="updateLink" method="post">
			<input type="hidden" name="id">
              <div class="form-group">
                <label for="recipient-name" class="control-label">链接名：</label>
                <input type="text" class="form-control" name="name" id="lname"><span id="warn1"></span>
              </div>
              <div class="form-group">
                <label for="recipient-name" class="control-label">链接地址：</label>
                <input type="text" class="form-control" name="url" id="lurl"><span id="warn2"></span>
              </div>
            </form>
          </div>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
            <button type="button" onclick="doEdit()" class="btn btn-primary">确认修改</button>
          </div>
        </div>
      </div>
    </div>
	
	<script>
		//验证链接名和链接地址是否为空
		$(function(){  
			$(":submit[id=send]").click(function(check){  
				var val = $(":text[id=linkname]").val();  
				var val2 = $(":text[id=linkaddr]").val();  
				if(val==""||val2==""){  
					//alert("文本框输入为空，不能提交表单！");  
					$(":text[id=linkname]").focus();  
					$(":text[id=linkaddr]").focus();  
					check.preventDefault();//此处阻止提交表单
					Modal.alert({msg:'添加失败:&nbsp;&nbsp;链接名或链接地址为空！！！',title:'添加链接操作',btnok:'确定',btncl:'取消'});
					//$("#warn2").html("<font color='red'>链接地址不能为空！</font>");
				}
			});  
		}); 
		
		
		//执行删除
		function doDel(id,bt){
			Modal.confirm({msg:'确定要删除此友情链接吗？'}).on(function(e){
					if(e){
						//执行Ajax发送并执行删除操作
						$.ajax({
							type:"GET",
							url: '__CONTROLLER__/del',
							data:"id="+id,
							dataType:"json",
							success:function(res){
								if(res.b){
									//删除节点
									$(bt).parents("tr").remove();
								}
							}
						});
					}
			   })
		}
		
		//执行友情链接的添加操作
        function doAdd(){
            //执行Ajax发送并执行添加操作
            $.ajax({
                type: 'POST',
                url : '__CONTROLLER__/insert',
                data: $('#addLink').serialize(), //获取要添加form表单信息
                dataType:"json",
                success:function(res){
                    if(res){
                       var str = '<tr><td>'+res.id+'</td>';
                       str += '<td>'+res.name+'</td>';
                       str += '<td>'+res.url+'</td>';
                       str += '<td>'+res.addtime+'</td>';
					   str += "<td><button class='btn btn-xs btn-primary' onclick='edit({$link.id})' data-toggle='modal' data-target='#exampleModal1'>编辑</button>&nbsp;";
                       str += "<button class='btn btn-xs btn-danger' onclick='doDel({$link.id},this)'>删除</button></td></tr>"; 
						
                       $("#linklist tbody").append(str);
					   //$("#addLink input").val();
					   //alert("111");
					   $('#Add input').val('');
                    }else{
                        Modal.alert({msg:'添加失败',title:'添加链接操作',btnok:'确定',btncl:'取消'});
                    }
                }
            });
			/*
			$('#Add').on("hidden.bs.modal",function(){
				$("addLink")[0].reset();
			});*/
            $('#Add').modal('hide'); //关闭添加标签浮动窗口
        }
		
		//获取编辑的内容,并放入input框中
		function edit(id){
			//alert("111");
			$.ajax({
				type:"GET",
				url:"__URL__/edit",
				data:'id='+id,
				dataType:'json',
				async:true,
				success:function(res){
					$("#lname").val(res.name);
					$("input[name='id']").val(res.id)
					$("#lurl").val(res.url);
				}
			});
		}
		
		//执行更改
		function doEdit(){
			//执行Ajax发送并执行更新操作
			//alert("lalala");
            $.ajax({
                type: 'POST',
                url : '__CONTROLLER__/update',
                data: $('#updateLink').serialize(), //获取要添加form表单信息
                dataType:"json",
                success:function(res){
                    if(res){
						$("."+res.id).children().eq(1).html(res.name);
						$("."+res.id).children().eq(2).html(res.url);
                    }else{
                        Modal.alert({msg:'更新失败',title:'更新链接操作',btnok:'确定',btncl:'取消'});
                    }
                }
            });
            $('#update').modal('hide'); //关闭添加标签浮动窗口
		}
	</script>
 </block>